<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>title</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css"/>
      <style>
      body{
        width: 100%;
        height: 100%;
        padding-top: 1.7rem;
      }
      .header{
            width: 93%;
            height: 2.5rem;
            line-height: 2.5rem;
            padding: 0.5rem 0.8rem;
            text-align: center;
            position: fixed;
            top:1.5rem;
            background-color: #40cccc;
            z-index: 999;
        }
      .header_img{
        width: 6%;
        height: 45%;
        float: left;
        margin-top: 0.4rem;
      }
      .header_img img{
        width: 100%;
        height: 100%;
      }
      .header h3{
        line-height: 3rem;
        width: 90%;
        margin-left: 0.7rem;
        text-align: center;
        font-weight: bold;
        color: #fff;
      }

      .fl{
        float: left;
      }
      .fr{
        float: right;
      }
      .up{
        width: 93%;
        height: 80%;
        padding: 0.5rem 0.8rem;
        overflow: hidden;
        margin-top: 3.5rem;
      }
      .pic{
        width: 100%;
        height: 20%;
        overflow: hidden;
        /*border: 0.1rem solid red;*/

      }
      .pic p{

      }
      .pic_img{
        width: 80%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
          /*overflow: auto;*/
      }
      .mv_img{
        width:70%;
        height: 8rem;
        padding:0rem 0.5rem 0.5rem 0.5rem;
      }
      .mv_img img{
        width: 100%;
        height: 100%;
      }
      .img{
        width: 5rem;
        height: 5rem;
      margin-bottom: 0.5rem;
        margin-left: 0.5rem;
      }
      .img img{
        width: 100%;
        height: 100%;
      }
      .pic_up{
        width:4.5rem;
        height: 1.8rem;
        border-radius: 1.8rem;
        background-color: #40cccc;
        color: #fff;
        text-align: center;
        line-height: 1.8rem;
        font-size: 0.9rem;
      }
      .footer{
        width: 80%;
        height: 2.5rem;
        position: absolute;
        bottom: 1rem;
        left:10%;
        box-sizing: border-box;
        display: flex;
        justify-content: space-around;
      }
      .footer p{
        width: 45%;
        height: 2.5rem;
        background-color: #40cccc;
        color: #fff;
        text-align: center;
        border-radius: 1.2rem;

        line-height: 2.5rem;
      }
      </style>
  </head>
  <body>
    <div class="header">
      <div class="header_img">
          <img src="../image/u18.png" alt="" onclick="closewin()">
      </div>
      <h3>发布作业</h3>

    </div>
  <div class="up">
    <div class="pic">
      <p class="fl">图片展示</p>
      <div class="pic_img">
        <div class="img fl" id="ss" style="display:none">
          <img src="" alt="" id="imgs">
        </div>


      </div>
      <a href="#" class="pic_up fr" onclick="sctp()">上传图片</a>
    </div>
  </div>
  <div class="up" style="margin-top:1rem;">
    <div class="pic">
      <p class="fl">视频展示</p>
      <div class="mv_img fl" id="sss"  style="display:none">

      </div>
      <a href="#" class="pic_up fr" onclick="scsp()">上传视频</a>
    </div>
  </div>
  <div class="footer">
    <p class="fl" onclick="bc()">保存数据</p>
    <!-- <p class="fl" style="background-color:#fb5353;">取消编辑</p> -->
  </div>
  </body>
  <script type="text/javascript" src="../script/api.js"></script>
  <script type="text/javascript" src="../script/common.js"></script>
  <script type="text/javascript" src="../script/jquery-1.8.3.js"></script>
  <script type="text/javascript">
    var userinfo = $api.getStorage('userinfo');
    var id
    var img_url
    var sp
      apiready = function(){
        id = api.pageParam.id
      };

      function bc() {
        api.confirm( {
          title: '提示',
          msg: '发布后由于学生作答不可修改?',
          buttons: [ '确定', '取消' ]
        }, function ( ret, err ) {
          var index = ret.buttonIndex;
          if ( index == 1 ) {
            api.ajax({
                url: SITE_URL+'livebr/cur/fbzy',
                method: 'post',
                data: {
                    values: {
                        imgs: img_url,
                        videos:sp,
                        id:id
                    }
                }
            },function(ret, err){
                if (ret) {
                  if(ret.error==200){
                    msgcode('发布成功')
                    api.sendEvent({
                        name: 'fbzy',
                        
                    });

                    setTimeout(function () {
                      api.closeWin({

                      });

                    },1000)
                  }else{
                    msgcode('稍后再试')
                  }
                    //alert( JSON.stringify( ret ) );
                } else {
                  msgcode('请检查网络')
                    //alert( JSON.stringify( err ) );
                }
            });


          }
        })
      }
      function scsp(){
        var UIAlbumBrowser = api.require('UIAlbumBrowser');
        UIAlbumBrowser.open({
            max: 1,
            type:'video',
            styles: {
                bg: '#fff',
                mark: {
                    icon: '',
                    position: 'bottom_left',
                    size: 20
                },

                nav: {
                    bg: 'rgba(0,0,0,0.6)',
                    titleColor: '#fff',
                    titleSize: 18,
                    cancelColor: '#fff',
                    cancelSize: 16,
                    finishColor: '#fff',
                    finishSize: 16
                }
            },
            rotation: true
        }, function(ret) {
            if (ret) {
              if(ret.eventType=='confirm'){

                up_file(ret.list[0]['path'])
                // var c = JSON.parse(ret.list)
                // alert(c[0])

              }
              //  alert(JSON.stringify(ret));
            }
        });
      }

      function up_file(path) {
        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: '上传中...',
            text: '先喝杯茶...',
            modal: false
        });
        alert(path)
        var obj = $api.byId('videos');
        var html =''
        api.ajax({
            url: SITE_URL+'livebr/cur/up_file',
            method: 'post',
            data: {

                files: {
                    files: path
                }
            }
        },function(ret, err){
            if (ret) {
              if(ret.error==200){
                msgcode('上传成功')
                sp = ret.data

                api.hideProgress();

              }else{
                api.hideProgress();
                msgcode('上传失败')
              }
                //alert( JSON.stringify( ret ) );
            } else {
              api.hideProgress();
              msgcode('请检查网络链接')
                //alert( JSON.stringify( err ) );
            }
        });

      }

      function sctp() {
        api.actionSheet({
             title : '上传照片',
             cancelTitle : '取消',
             buttons : ['拍照', '手机相册']
         }, function(ret, err) {
             if (ret) {
                 if (ret.buttonIndex == 1) {
                     api.getPicture({
                         sourceType : 'camera',
                         encodingType : 'jpg',
                         mediaValue : 'pic',
                         destinationType : 'url',
                         allowEdit : false,
                         quality : 100,
                         saveToPhotoAlbum : false
                     }, function(ret, err) {
                         //  alert(JSON.stringify(ret));
                         if (ret) {
                             saveImg(ret.data);
                         } else {
                             api.toast({
                                 msg : '图像获取失败',
                                 duration : 3000,
                                 location : 'bottom'
                             });
                         }
                     });
                 } else if (ret.buttonIndex == 2) {
                     //手机相册选图片
                     api.getPicture({
                         sourceType : 'library',
                         encodingType : 'png',
                         mediaValue : 'pic',
                         destinationType : 'url',
                         allowEdit : true,
                         quality : 100,
                         preview:true,
                         saveToPhotoAlbum : false
                     }, function(ret, err) {
                          //  alert(JSON.stringify(ret.data));
                         if (ret) {
                           saveImg(ret.data);
                         } else {
                             api.toast({
                                 msg : '图像获取失败',
                                 duration : 3000,
                                 location : 'bottom'
                             });
                         }
                     });
                 }
             }
         });

      }
      function saveImg(path) {
        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: '努力加载中...',
            text: '先喝杯茶...',
            modal: false
        });

        var html =''
        var obj = $api.byId('img_list');
        api.ajax({
            url: SITE_URL+'square_api/fileservice/posting_img',
            method: 'post',
            data: {
                files: {
                    image: path
                }
            }
        },function(ret, err){
            if (ret) {
              if(ret.error==200){

                img_url = ret.data
                $("#ss").css('display','block')
                $('#imgs').attr('src',img_url)
                setTimeout(function () {
                  api.hideProgress();

                },2000)
              }else{
                setTimeout(function () {
                  msgcode('上传失败,稍后再试')
                  api.hideProgress();

                },2000)
              }
    //            alert( JSON.stringify( ret ) );
            } else {
              setTimeout(function () {
                msgcode('上传失败1张图片')
                api.hideProgress();

              },2000)

                //alert( JSON.stringify( err ) );
            }
        });

      }
  </script>
  </html>
